﻿<!--学生查看文章列表(发布或全部)-->
<style>
	.kk {
		position: fixed;
	}
	
	.tongzhi {
		margin: 0 auto;
		height: 150px;
		padding-top: 2px;
		padding-bottom: 2px;
		padding-left: 10px;
		padding-right: 10px;
		border-bottom: 1px solid gainsboro;
		cursor: pointer;
	}
	
	.tongzhi:hover {
		background-color: gainsboro;
	}
	
	h3 {
		font-size: 24px;
		font-weight: 600;
		margin-top: 10px;
		max-width: 960px;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	
	.content {
		margin-left: 4px;
		margin-top: 15px;
		text-decoration: none;
		cursor: pointer;
		font-size: 16px;
		color: gray;
		max-width: 900px;
		max-height: 30px;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	
	.footer {
		position: relative;
		top: 15px;
	}
	
	.footer span {
		margin-left: 20px;
	}
	
	.btnn {
		float: right;
		margin-left: 10px;
	}
</style>

<!-- 我的HTML部分 -->
<div id="big">

</div>

<nav aria-label="...">
	<ul class="pager">
		<li>
			<a href="#" id="pre">上一页</a>
		</li>
		<li>
			<a href="#" id="top">首页</a>
		</li>
		<li>第<span class="num">1</span>页</li>
		<li>
			<a href="#" id="end">尾页</a>
		</li>
		<li>
			<a href="#" id="next">下一页</a>
		</li>
	</ul>
</nav>

<script>
	scroll(0, 0);

	var pageSize = 10;

	var path = "get-articles";
	var path_a = './article.html';

	//0为自己的文章，-1为全部的文章
	if($.session.get("a_flag") == 0) {
		path = "user/get-my-articles";
		path_a = './updateArticle.html';
	} else {
		path = "get-articles";
		path_a = './article.html';
	}

	function fenye(pageNum) {
		//文章的ajax
		$.ajax({
			xhrFields: {
				withCredentials: true
			},
			type: 'GET',
			url: getFullURL(path),
			data: {
				pageNum: pageNum,
				pageSize: pageSize
			},
			success: function(data) {
				if(data.status == -1) {
					alert('请求失败')
				} else if(data.status == 0) {
					console.log(data)
					$.session.set("prePageNum", data.page.prePageNum);
					$.session.set("nextPageNum", data.page.nextPageNum);
					$.session.set("totalPageNum", data.page.totalPageNum);
					$('.num').html(data.page.pageNum);
					var list = data.page.list;
					$('#big').html("");
					for(var i = 0; i < list.length; i++) {
						var str = ``;

						if($.session.get("a_flag") == 0) {
							str = `
								<div class="tongzhi" id="big_` + list[i].arid + `">
								    <h3>` + list[i].title + `</h3>
								    <div class="content" id="look" index="lookactivity">` + list[i].content + `</div>
								    <div class="footer">` + timeStamp2String(list[i].createTime) + `<span class="hotTOP10-ul-li-span1">★&nbsp;` + list[i].dianzan + `</span>
								    	<button class="xiugai btn btn-primary btnn" id="xiugai_` + list[i].arid + `" value="` + list[i].arid + `">修改</button>
				                        <button class="remove btn btn-primary btnn" id="remove_` + list[i].arid + `" value="` + list[i].arid + `">删除</button>
								    </div>
								    <input type="hidden" id="arid" value='` + list[i].arid + `'/>
								</div>
	                       `;
						} else {
							str = `
								<div class="tongzhi" id="big_` + list[i].arid + `">
								    <h3>` + list[i].title + `</h3>
								    <div class="content" id="look" index="lookactivity">` + list[i].content + `</div>
								    <div class="footer">` + timeStamp2String(list[i].createTime) + `&emsp;` + list[i].name + `<span class="hotTOP10-ul-li-span1" style="float:right;">★&nbsp;` + list[i].dianzan + `</span></div>
								    <input type="hidden" id="arid" value='` + list[i].arid + `'/>
								</div>
	                       `;
						}

						var div = $('<div></div>');
						div.html(str);
						$('#big').append(div);

						var xiugai = '#xiugai_' + list[i].arid;
						$(xiugai).click(function() {
							$.session.set('arid', $(this).val());
							$('.center').html('');
							$('.center').load(path_a);
							return false;
						})

						var str1 = `
				          <div class="modal-dialog modal fade kk" id="anniu1_` + list[i].arid + `" >
				            <div class="modal-content">
				              <div class="modal-header">
				                <button type="button" class="close" data-dismiss="modal">&times;</button>
				                <h4>提示</h4>
				              </div>
				              <div class="modal-body">
				                <p>是否确认删除?</p>
				              </div>
				              <div class="modal-footer">
				                <button type="button" class="btn btn-default" class="close" data-dismiss="modal">取消</button>
				                <button type="button" class="btn btn-primary" class="close" id="ok_` + list[i].arid + `" data-dismiss="modal" value="` + list[i].arid + `">确认</button>
				              </div>
				            </div>
				          </div>
				          `;

						var div1 = $('<div></div>');
						div1.html(str1);
						$('#big').append(div1);

						var remove = '#remove_' + list[i].arid;
						$(remove).click(function() {
							var anniu1 = '#anniu1_' + $(this).val();
							$(anniu1).modal({
								keyboard: true,
								show: true
							})
							return false;
						})

						var ok = '#ok_' + list[i].arid;
						$(ok).click(function() {
							$.ajax({
								xhrFields: {
									withCredentials: true
								},
								type: 'GET',
								url: getFullURL("user/del-article"),
								data: {
									arid: $(this).val()
								},
								dataType: 'json',
								success: function(data) {
									if(data.status == 0) {
										setTimeout(() => {
											$('.center').html('');
											$('.center').load('./articlelist.html');
										}, 300);
									}
								},
								error: function(err) {
									alert("请求异常，请重新登录！", function() {
										$(location).attr('href', './login.html');
									})
								}
							})
						})

						var div_id = "#big_" + list[i].arid;
						$(div_id).click(function() {
							$.session.set("arid", $(this).children("input").eq(0).val());
							$('.center').html('');
							$('.center').load(path_a);
						})
					}
				}
			},
			error: function(err) {
				alert("请求异常，请重新登录！", function() {
					$(location).attr('href', './login.html');
				})
			}
		})
	}

	var page = 0;
	if($.session.get("page") == null) {
		page = 1;
	} else {
		page = $.session.get("page");
	}

	fenye(page);

	$("#top").click(function() {
		fenye(1);
		$.session.set("page", 1);
	})
	$("#end").click(function() {
		fenye($.session.get("totalPageNum"));
		$.session.set("page", $.session.get("totalPageNum"));
	})
	$("#pre").click(function() {
		fenye($.session.get("prePageNum"));
		$.session.set("page", $.session.get("prePageNum"));
	})
	$("#next").click(function() {
		fenye($.session.get("nextPageNum"));
		$.session.set("page", $.session.get("nextPageNum"));
	})

	function timeStamp2String(time) {
		var datetime = new Date();
		datetime.setTime(time);
		var year = datetime.getFullYear();
		var month = datetime.getMonth() + 1 < 10 ? "0" + (datetime.getMonth() + 1) : datetime.getMonth() + 1;
		var date = datetime.getDate() < 10 ? "0" + datetime.getDate() : datetime.getDate();
		var hour = datetime.getHours() < 10 ? "0" + datetime.getHours() : datetime.getHours();
		var minute = datetime.getMinutes() < 10 ? "0" + datetime.getMinutes() : datetime.getMinutes();
		var second = datetime.getSeconds() < 10 ? "0" + datetime.getSeconds() : datetime.getSeconds();
		return year + "-" + month + "-" + date + " " + hour + ":" + minute + ":" + second;
	}
</script>